<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>多媒体查询</title>
</head>
<body>
<div class="a1"></div>
<div>
    <a href="mailto:9@qq.com" data-email="9@qq.com"  class="b">发起邮件</a>
</div>
<style>
    .a1 {
        background-color: pink;
        resize: both;
        width: 500px;
        height: 500px;
        display: none;
    }

    @media screen and (max-width: 480px) {
        .a1 {
            background-color: lightgreen;
        }
    }
    @media screen and(max-width: 480px) {
        .b{
            background-image: url("
            ");
        }
    }
</style>
</body>
</html>